<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Document</title>
  </head>
  <body>
    <p class="text" style="font-size: 24px"></p>

    <script>
      const text = document.querySelector('p')

      if ('EventSource' in window) {
        // todo
      }

      let url = 'http://127.0.0.1:8844/stream'
      // 打开withCredentials属性，表示是否一起发送 Cookie。
      const source = new EventSource(url)
      console.log(source.readyState)

      source.onopen = function(event) {
        // todo
        console.log('连接成功...')
      }

      let str = ''

      source.onmessage = function(event) {
        const data = event.data
        const origin = event.origin
        const lastEventId = event.lastEventId

        // console.log('from server data is ' + data)
        str += data
        
        text.innerText = str
      }
    </script>
  </body>
</html>
